<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>使用grayQueue模板的demo</title>
<script src="http://a.tbcdn.cn/s/kissy/1.2.0/kissy.js"></script>
</head>
<style>
    body {
        font-family: 'Microsoft YaHei';
        font-size: 12px;
        color: #404040;
    }
    h4{
        font-size:16px;
    	color:#C58080;
        margin:10px 0;
    }
</style>
<body>

<article id="main">
    <h4>模板名：grayQueue</h4>
    <p>作者：明河（剑平）</p>
    <p>版本：V1.0</p>
    <div class="demo-wrapper">
        <form action="test.php">
            <div class="uploader-wrapper gray-queue">
                <div class="clearfix header-footer gray-queue-header">
                    <div class="f-l file-name">文件名</div>
                    <div class="f-r file-status">状态</div>
                    <div class="f-r file-size">文件大小</div>
                </div>
                <ul class="gray-queue-list" id="J_UploaderQueue">

                </ul>
                <div class="clearfix header-footer gray-queue-footer">
                    <div class="f-l uploader-btn-wrapper">
                        <!-- 选择文件按钮，组件配置写在这里 -->
                        <a id="J_UploaderBtn" class="f-l uploader-icon uploader-button uploader-button-focus" data-config=
                                '{"theme" : "uploader/themes/grayQueue",
                                "autoUpload" : false,
                                "type" : "auto",
                                "serverConfig":{"action":"../../demo/upload.php","data":{"dir":"files/"},"dataType" : "json"},
                                "name":"Filedata",
                                "urlsInputName":"fileUrls"}'
                           href="#">
                            选择文件
                        </a>
                        <a id="J_StartUpload" class="f-l uploader-icon uploader-button start-upload start-upload-disabled" href="#">开始上传</a>
                        <input type="hidden" name="fileUrls" value="" />
                    </div>
                    <div id="J_TotalProgressNum" class="f-r file-status clearfix">
                        0%
                    </div>
                    <div id="J_TotalSize" class="f-r file-size"></div>
                    <div id="J_ProgressBar" class=" f-r progress-wrapper">

                    </div>
                </div>
            </div>
        </form>
    </div>
</article>
<script>
    KISSY.Config.base = '../../../';
    KISSY.use('uploader/render', function(S, RenderUploader) {
        var renderUploader = new RenderUploader('#J_UploaderBtn', '#J_UploaderQueue');
    })
</script>
</body>
</html>